import { onMounted, reactive } from "vue";
import axios from "axios";

export default function () {
  let dogList = reactive([
    "https://images.dog.ceo/breeds/pembroke/n02113023_3927.jpg",
  ]);

  async function addDog() {
    const result = await axios.get(
      "https://dog.ceo/api/breed/pembroke/images/random"
    );
    dogList.push(result.data.message);
  }

  onMounted(() => {
    addDog();
  });

  return {
    dogList,
    addDog,
  };
}
